<template>
  <div class="apirequestbody">
      <div class="requestbodydiv" style="float: left">
        <span class="requestbodyspan1">&nbsp;请求头部</span>
        <!--<span class="requestbodyspan2 fs12 plr5 ptb2 mr5">JSON</span>-->
        <!--<span class="requestbodyspan2 fs12 plr5 ptb2 mr5">最外层结构为：Object</span>-->
        <span class="requestbodyspan3 fs12 plr5 ptb2 mr5">生成预览数据</span>
      </div>
    <!--<div class="searchIten" style="float: right">-->
      <!--<span class="selectBtn"><i class="iconfont">&#xe605;</i>列表项</span>-->
    <!--</div>-->
    <div>
    <el-table
      :data="tableData"
      size="small"
      border
      class="elementTable"
      header-cell-class-name="elementTableHeader"
      cell-class-name="elementTableBody"
      highlight-current-row>
      <el-table-column  width="300" align="center" label="标签" >
        <template slot-scope="scope">
          {{scope.row.headerName}}
        </template>
      </el-table-column>
      <el-table-column   align="center" label="必含">
        <template slot-scope="scope" >
        <span v-if="scope.row.required==1">是</span>
        <span v-else>否</span>
        </template>
      </el-table-column>
      <!--<el-table-column  width="100" align="center" label="必含" prop="required"-->
                        <!--:filters="[{ text: '是', value: 1 },{ text: '否', value: 0 }]"-->
                        <!--:filter-method="filterRequired">-->
        <!--<template slot-scope="scope" >-->
         <!--<span v-if="bhspan=='是'">{{bhspan}}</span>-->
          <!--<span v-if="bhspan=='是'">{{bhspan1}}</span>-->
        <!--</template>-->
      <el-table-column  width="300" align="center" label="说明" prop="remarks"></el-table-column>
      <el-table-column  width="300" align="center" label="限制" prop="remarks"></el-table-column>
      <el-table-column   align="center" label="示例" prop="headerValue"></el-table-column>
      <el-table-column   width="150" align="center"  label="全部展开" >
        <template slot-scope="scope">
          <span  v-if="control" @click="oncontrol" style="color: #00a0e9">展开</span>
          <span  v-else @click="oncontrol1" style="color: #00a0e9">收缩</span>
        </template>
      </el-table-column>
    </el-table>
  </div>
  </div>
</template>

<script>
  export default {
    name: 'apiState',
    props: {
      form: {},
      editData: {}
    },
    data() {
      return {
        control: true,
        tableData: [],
        dataArr: this.form,
      }
    },
    created() {
      // 请求头部
      this.tableData = this.editData.reqHeaderInfo
    },
    methods: {
      oncontrol() {
        this.control = false
      },
      oncontrol1() {
        this.control = true
      },
      filterTag(value, row) {
        return row.type === value
      },
      filterRequired(value, row) {
        if (row.required == 1) {
          this.bhspan = '是'
        } else {
          this.bhspan = '否'
        }
        return row.required === value
      },
      burlChangeVal() {
        this.$emit('changeFormFun', this.dataArr)
      }
    }
  }
</script>

<style scoped>
</style>
